<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/blog.css">
</head>
<body>
    <!--名片-->
    <div class="ui card b-card-margin">
        <div class="content">
            <img class="right floated mini ui image" src="https://picsum.photos/seed/picsum/200/150">
            <div class="header">
                林小黑
            </div>
            <div class="meta">
                即将毕业IT小朋友
            </div>
            <div class="description">
                Elliot requested permission to view your contact details
                <br/>
                <div class="content">
                    <i class="mail icon"></i><a href="#">1341110191@qq.com</a>
                </div>
            </div>
        </div>
    </div>
    <!--分类-->
    <h4 class="ui horizontal divider header">
        <i class="idea outline icon"></i>分类
    </h4>
    <div class="ui selection list">
        <div id="kind" class="ui vertical menu">
            <!--<a class=" teal item">
                收件箱
                <div class="ui teal left pointing label">1</div>
            </a>-->
        </div>
    </div>
    <!--标签-->
    <h4 class="ui horizontal divider header">
        <i class="bookmark outline icon"></i>
        标签
    </h4>
    <div id="label">

    </div>
    <!--<a class="ui blue basic label b-margin-padding-label">你是我的</a>-->
<!--                <div class="ui teal left pointing label">1</div>
-->

</body>
<script src="${pageContext.request.contextPath}/static/js/jquery-3.4.1.js"></script>
<script>
    $(function () {
        $.ajax({
            url:"${pageContext.request.contextPath}/side",
            method:"post",
            success:function (response) {
                console.log(response);
                let $labels=response.objectMap.labels;
                let $kinds=response.objectMap.kinds;
                for(let i=0;i<$kinds.length;i++){
                    let $a=$("<a>").addClass("teal item").attr("href","${pageContext.request.contextPath}/kind/"+$kinds[i].id+"/1").text($kinds[i].kind);
                    let $div=$("<div>").addClass("ui teal left pointing label").text($kinds[i].num);
                    $a.append($div);
                    $("#kind").append($a);
                }
          //  <a class="ui blue basic label b-margin-padding-label">你是我的</a>

                for(let j=0;j<$labels.length;j++){
                    let $a=$("<a>").addClass("ui blue basic label b-margin-padding-label").attr("href","${pageContext.request.contextPath}/label/"+$labels[j].id+"/1").text($labels[j].label);
                    $("#label").append($a);
                }
            },
            error:function () {
                console.log("小二在众目下丢失了方向")
            }
        });
    });



</script>

</html>